<template>
    <el-table v-loading="Loading" :data="addadminlist" style="width: 100%">
        <el-table-column fixed prop="adminid" label="管理员id" width="300" />
        <el-table-column prop="adminname" label="管理员姓名" width="180" />
        <el-table-column prop="role" label="管理员级别" width="120">
            <template #default="scope">
                <span>{{ scope.row.role == 1 ? "超级管理员" : "普通管理员" }}</span>
            </template>
        </el-table-column>
        <el-table-column label="操作" width="180">
            <template #default="scope">
                <el-popconfirm title="亲，您真的要删除吗?" @confirm="deleadmin(scope.row.adminid)">
                    <template #reference>
                        <el-button>删除</el-button>
                    </template>
                </el-popconfirm>
                <el-button @click="changeAdminname(scope.row.adminname)">修改</el-button>
            </template>

        </el-table-column>



    </el-table>
    <Cart v-show="showcart" @showcart="hidden" :adminname="aDminname" @cartsussess="success"></Cart>
</template>

<script setup lang="ts">
import { reactive, ref } from 'vue'
import service from '../../../utils/service';
import { ElMessage } from 'element-plus';
import 'element-plus/dist/index.css';
import Cart from "./cart.vue";
import { Loading } from '@element-plus/icons-vue';

const Loading=ref(true)
interface listAdmin {
    "adminid": string,
    "adminname": string,
    "role": number,
    "_id": string[]


}
const addadminlist = reactive<listAdmin[]>([])
const getAdminlist = () => {
    service({
        url: "/admin/list"
    }).then(res => {
        if (res.data.code === "200") {
            addadminlist.length = 0
            addadminlist.push(...res.data.data)
            Loading.value=false

        }

    })
}
getAdminlist()

//删除管理员
const deleadmin = (adminid: string) => {
    service({
        url: "/admin/delete",
        method: "post",
        data: {
            adminid
        }
    }).then(res => {
        if (res.data.code === "200") {
            //200加引号
            ElMessage({
                message: '删除成功！',
                type: 'success',

            })
            getAdminlist()


        }

    })

}
const showcart = ref(false);//控制修改组件的显示和隐藏
const aDminname = ref("");//要修改的 管理员姓名

const changeAdminname = (adminname: string) => {
    aDminname.value = adminname;
    showcart.value = true;
}

const hidden = () => {
    showcart.value = false;
}
// 当修改成功后，需要重新发送请求，获取最新数据
const success = () => getAdminlist();



</script>

<style></style>